<template>
	<div>
    <div class="header">
    	<div class="site-topbar">
        <div class="container">
          <div class="topbar-nav">
            <a>小米商城</a>
            <span class="sep">|</span>
            <a>MIUI</a>
            <span class="sep">|</span>
            <a>IOT</a>
            <span class="sep">|</span>
            <a>云服务</a>
            <span class="sep">|</span>
            <a>金融</a>
            <span class="sep">|</span>
            <a>有品</a>
            <span class="sep">|</span>
            <a>小爱开发平台</a>
            <span class="sep">|</span>
            <a>企业团购</a>
            <span class="sep">|</span>
            <a>资质证照</a>
            <span class="sep">|</span>
            <a>协议规格</a>
            <span class="sep">|</span>
            <a>下载app</a>
            <span class="sep">|</span>
            <a>Select Location</a>
          </div>
          <div class="topbar-cart">
            <a class="cart-mini" @click="cart">
              <em></em>
              <em>购物车</em>
            </a>
          </div>
          <div class="topbar-info">
            <a class="link" @click="login">登录</a>
            <span class="sep">|</span>
            <a class="link" @click="register">注册</a>
            <span class="sep">|</span>
            <span class="message">
              <a>消息通知</a>
            </span>
          </div>
        </div>
        <div></div>
      </div>
      <div class="site-header">
        <div class="container">
          <div class="header-logo">
            <a>
              <img src="../assets/img/mi.png" />
            </a>
          </div>
          <div class="header-nav">
            <ul class="nav-list">
              <li class="nav-category">
                <a class="link-category"></a>
              </li>
              <li class="nav-item">
                <a class="link">
                  <span>小米手机</span>
                </a>
              </li>
              <li class="nav-item">
                <a class="link">
                  <span>Redmi 红米</span>
                </a>
              </li>
              <li class="nav-item">
                <a class="link">
                  <span>电视</span>
                </a>
              </li>
              <li class="nav-item">
                <a class="link">
                  <span>笔记本</span>
                </a>
              </li>
              <li class="nav-item">
                <a class="link">
                  <span>家电</span>
                </a>
              </li>
              <li class="nav-item">
                <a class="link">
                  <span>路由器</span>
                </a>
              </li>
              <li class="nav-item">
                <a class="link">
                  <span>智能硬件</span>
                </a>
              </li>
              <li class="nav-item">
                <a class="link">
                  <span>服务</span>
                </a>
              </li>
              <li class="nav-item">
                <a class="link">
                  <span>社区</span>
                </a>
              </li>
            </ul>
          </div>
          <div class="header-search">
            <form class="search-form">
              <input type="text" class="search-text"/>
              <!-- <input type="submit"  value="" -->
              <img class="search-btn" src="../assets/img/submit.png" />
              <div class="search-hot-words">
                <a>小米9 Pro 5G</a>
                <a>Redmi Note 8</a>
              </div>
            </form>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
	export default{
		data(){
			return{

			}
		},
		components:{

		},
		methods:{
      //页面跳转
      login(){
        this.$router.push({path:"login"});
      },
      register(){
        this.$router.push({path:"register"});
      },
      cart(){
        this.$router.push({path:"cart"});
      }
		}
	}
</script>

<style scoped="scoped">
  @import url("../assets/css/bavbar.css");
</style>
